<template>
  <div>
    Parent---<br />
    <my-dialog>
      <!-- 这种是旧的写法 -->
      <div slot="title">
        <h1 style="color:red;">标题呀</h1>
      </div>
      <!-- 只有默认插槽才能省略 template，但是如果要获取值的时候，不能省略 -->
      <!-- <template #default> -->
      <template #icon>
        <form action="">
          用户名:<input type="text" /><br />
          密码:<input type="text" /><br />
        </form>
      </template>
      <!-- 这里的template不要和最外层的template搞混淆了 -->
      <!-- 新的写法 #是v-slot:的简写 -->
      <template #footer>
        <button>取消</button>&nbsp;
        <button>确认</button>
      </template>
    </my-dialog>
  </div>
</template>

<script>
import MyDialog from './MyDialog'
export default {
  components: {
    MyDialog
  }
}
</script>
